<%@ page contentType="text/html;charset=UTF-8" %>
<!DOCTYPE html>
<html>
<head>
    <title>Popup editing</title>
    <meta charset="utf-8">
	<%@ include file="/WEB-INF/view/common/head.jsp"%>
    <script src="${basepath}/assets/jqueryupload/js/vendor/jquery.ui.widget.js"></script>
    <script src="${basepath}/assets/jqueryupload/js/jquery.iframe-transport.js"></script>
    <script src="${basepath}/assets/jqueryupload/js/jquery.fileupload.js"></script>
    <script src="${basepath}/assets/jqueryupload/js/jquery.fileupload-process.js"></script>
    <link rel="stylesheet" href="${basepath}/assets/jqueryupload/css/jquery.fileupload.css">
    <link rel="stylesheet" href="${basepath}/assets/xenon/css/bootstrap.css">
	<script type="text/javascript" src="${basepath}/assets/layer/layer.js"></script>
	<script type="text/javascript" src="${basepath}/assets/laydate/laydate.js"></script>
	<script type="text/javascript" src="${basepath}/assets/raty/lib/jquery.raty.min.js"></script>
	<script type="text/javascript" src="${basepath}/assets/my97/WdatePicker.js"></script>
	
	<link rel="stylesheet" href="${basepath}/assets/kindedit/themes/default/default.css" />  
    <script charset="utf-8" src="${basepath}/assets/kindedit/kindeditor-all-min.js"></script>  
    <script charset="utf-8" src="${basepath}/assets/kindedit/lang/zh_CN.js"></script>
    <style>
    	body {
			padding: 0;
			font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
			font-size: 12px;
		}
		.page-body{
			padding:20px;
		}
		.btndiv{
			padding-top:10px;
			text-align:center;
			display: inline-block; 
			width:100%
		}
    </style>
</head>
<body class="page-body" >
		<form class="bootstrap-frm" action="" method="post" id="teacherForm" name="teacherForm">
			<input type="hidden" id="user_id" name="user_id" value="${user_id}"/> 
			<input type="hidden" id="dept_id" name="dept_id" value="${dept_id}"/> 
			<table>
              <tr>
                  <td style="width:100px;padding:5px">
                      <label style="font-size:14px;">姓名</label>
                  </td>
                  <td style="width:220px;padding:5px">
                  		<input type="text" name="user_name" class="form-control" id="user_name" style="width:200px" value="${user_name}">
                  </td>
              </tr>
              <tr>
                  <td style="width:100px;padding:5px">
                      <label style="font-size:14px;">部门</label>
                  </td>
                  <td style="width:220px;padding:5px">
                  		<input type="text" name="dept_name" class="form-control" id=dept_name style="width:200px" readonly="readonly" value="${dept_name}">
                  </td>
              </tr>
              <tr>
                  <td style="width:100px;padding:5px">
                      <label style="font-size:14px;">姓别</label>
                  </td>
                  <td style="width:220px;padding:5px">
                  		<select name="sex" id="sex" style="width:200px" class="form-control">
                    		<option value=''>请选择</option>
                    		<option value='0'>男</option>
                    		<option value='1'>女</option>
                    	</select>
                  </td>
              </tr>
              <tr>
                  <td style="width:100px;padding:5px">
                      <label style="font-size:14px;">生日</label>
                  </td>
                  <td style="width:220px;padding:5px">
                  	  <input id="birthday" name="birthday" class="form-control" style="width:200px" type="text" onfocus="WdatePicker({dateFmt:'yyyy-M-d'})" value="${birthday}"/>
                  </td>
              </tr>
              <tr>
                  <td style="padding:5px">
                     <label style="font-size:14px;">头像</label>
                  </td>
                  <td style="padding:5px">
                  	<div style="display:inline-block;width:60%;padding-right:30px;padding-top:30px;float:left">
	        			<input id="fileupload" type="file" name="file" class="form-control"  multiple>
	        			<div id="progress" class="progress">
					        <div class="progress-bar progress-bar-success" class="form-control"></div>
					    </div>
				    </div>
                  	<div style="float:left">
                  	<img id="image" style="height:120px;width:110px" src="${image_src}"/>
                  	<input id="image_src" type="hidden" name="image_src" value="${image_src}">
                  	</div>
                  </td>
              </tr>
              <tr>
                  <td style="padding:5px">
                     <label style="font-size:14px;">分数</label>
                  </td>
                  <td style="padding:5px">
                  	<input type="text" name="t_score" class="form-control" id="t_score" style="width:200px;float:left;" >
                  	<div id="precision-demo" class="target-demo" style="float:left;margin-top:3px"></div>
                  </td>
              </tr>
              <tr>
                  <td style="padding:5px">
                     <label style="font-size:14px;">职称</label>
                  </td>
                  <td style="padding:5px">
                  	<input type="text" name="title" class="form-control" id="title" style="width:200px" value="${title}">
                  </td>
              </tr>
              <tr>
                  <td style="width:100px;padding:5px">
                      <label style="font-size:14px;">描述</label>
                  </td>
                  <td style="padding:5px">
                      <textarea name=desc id="desc" class="form-control" style="width:610px;height:80px" >${desc}</textarea>
                  </td>
              </tr>
              <tr>
                  <td style="width:100px;padding:5px">
                      <label style="font-size:14px;">掠影</label>
                  </td>
                  <td style="padding:5px">
                      <textarea name=teach_glimpse id="teach_glimpse" class="form-control" style="width:610px;height:240px" >${teach_glimpse}</textarea>
                  </td>
              </tr>
          </table>
          <div class="btndiv" ><a href="#" onclick="subForm()" style="border-radius:4px;" class="btn btn-default">确定</a></div>
      </form>
</body>
<script>
	//保存String user_id,String desc,String score,String image_src,
	var subForm = function(){
		//var formval = $('#teacherForm').serialize(); 
		var formval = serializeForm(teacherForm);
		formval = JSON.parse(formval);
		formval.teach_glimpse = editor.html();
		$.ajax({
            url: '${path}/teacher/saveTeacherInfo',
            //contentType: "application/json",
            //type:'POST', 
            data: formval,
            //dataType: 'json',
            success: function(doc) {
            	layer.msg(doc.msg, {time: 3000, icon:6});
            }
        });
	}
	
	$(function () {
		$('#sex').val('${sex}');
		$('#fileupload').fileupload({
	        url: "${path}/teacher/fileUpload",
	        autoUpload: true,
	        //dataType: 'json',
	        done: function (e, data) {
	        	if(data.result.status==0){
	        		layer.msg(data.result.msg, {time: 3000, icon:6});
	        	}else{
	        		$('#image').attr('src',data.result.image_src)
	        		$('#image_src').val(data.result.image_src)
	        	}
	        },
	        progressall: function (e, data) {
	            var progress = parseInt(data.loaded / data.total * 100, 10);
	            $('#progress .progress-bar').css(
	                'width',
	                progress + '%'
	            );
	        }
	    }).prop('disabled', !$.support.fileInput).parent().addClass($.support.fileInput ? undefined : 'disabled');
	
		$.fn.raty.defaults.path = '${basepath}/assets/raty/lib/img';
	      $('#precision-demo').raty({
    	  	path      : '${basepath}/assets/raty/lib/img',
          	cancelOff : 'cancel-off-big.png',
          	cancelOn  : 'cancel-on-big.png',
          	size      : 24,
          	starHalf  : 'star-half-big.png',
          	starOff   : 'star-off-big.png',
          	starOn    : 'star-on-big.png',
	        target    : '#t_score',
	        cancel    : true,
	        targetKeep: true,
	        precision : true
	      });   
	      
	      $('#t_score').val('${t_score}');
	});
	
	var editor;  
    KindEditor.ready(function(K) {  
        editor = K.create('textarea[name="teach_glimpse"]', {  
        	items: ["source", "|", "undo", "redo", "|", "preview", "template", "code", "cut", "copy", "paste", "plainpaste", "wordpaste", "|", "justifyleft", 
        	        "justifycenter", "justifyright", "justifyfull", "insertorderedlist", "insertunorderedlist", "indent", "outdent", "subscript", "superscript", 
        	        "clearhtml", "quickformat", "selectall", "|", "fullscreen", "/", "formatblock", "fontname", "fontsize", "|", "forecolor", "hilitecolor", 
        	        "bold", "italic", "underline", "strikethrough", "lineheight", "removeformat", "|", "image", "multiimage", "insertfile", "table", 
        	        "hr", "emoticons", "baidumap", "pagebreak"],
        	allowFileManager : true,
            allowImageUpload : true, 
        	uploadJson  : '${basepath}/assets/kindedit/jsp/upload_kind.jsp'
        });  
    });  
</script>
</html>
